<template>
  <div class="standard">
    <el-card>
      <el-button type="primary" size="small" @click="handleAdd('operate_modal')">新增</el-button>
    </el-card>
    <div style="height:10px"></div>
    <el-table :data="tableData" :height="tableHeight">
      <el-table-column prop="custName" label="客户名称"></el-table-column>
      <el-table-column prop="carNo" label="车牌号"></el-table-column>
      <el-table-column prop="driver" label="驾驶员"></el-table-column>
      <el-table-column prop="standardId" label="排放标准">
        <template slot-scope="scope">
          {{ STANDARD[scope.row.standardId] }}
        </template>
      </el-table-column>
      <el-table-column prop="createTime" label="创建时间"></el-table-column>
      <el-table-column prop="updateTime" label="更新时间"></el-table-column>
      <el-table-column width="200" label="操作">
        <template slot-scope="scope">
          <el-button type="text" @click="handleEdit('operate_modal', scope.row)">编辑</el-button>
          <el-button type="text" @click="handleRemove(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <OperateModal ref="operate_modal" @ok="handleSearch" />
  </div>
</template>

<script>
import OperateModal from './modal/operateModal.vue'
import { indexMixin } from '@/utils/mixin'
import { getStandardList, removeStandard } from '@/api/standard'
export default {
  data () {
    return {
      tableData: [],
      STANDARD: {
        1: '国五',
        2: '国六A',
        3: '国六B'
      }
    }
  },
  mixins: [indexMixin],
  components: {
    OperateModal
  },
  created () {
    this.handleSearch()
  },
  computed: {
    tableHeight () {
      // const pagination = 60
      const condition = 84
      const pagePadding = 40
      const header = 60
      return window.innerHeight - condition - pagePadding - header
    },
  },
  methods: {
    handleSearch () {
      this.queryList()
    },
    handleRemove (row) {
      if (!row.id) {
        this.$message.warning('数据异常：缺少id')
        return;
      }
      this.$confirm('确定要删除吗？', '提示').then(async () => {
        await removeStandard(row.id)
        this.handleSearch()
      })
    },
    async queryList () {
      const res = await getStandardList()
      if (res.code === 200) {
        this.tableData = res.data
      } else {
        this.tableData = []
        this.$message.error(res.msg)
      }
    }
  }
}
</script>

<style lang="less" scoped>
.standard {
  height: 100%;
}
</style>